<template>
  <div class="wrap">
    <span class="status">{{wrap.status_name}}</span>
    <OrderItem :item="wrap" :type="type"/>
    <OrderListFooter :item="wrap" :type="type" @reload="handleReload"/>
  </div>
</template>

<script>
import OrderItem from "@/components/order/OrderItem";
import OrderListFooter from "@/components/order/OrderListFooter";
import OrderDetailFooter from "@/components/order/OrderDetailFooter";

export default {
  props: ["wrap",  "type"],
  components: { OrderItem, OrderListFooter, OrderDetailFooter },
  computed: {
    statusText() {
      switch (this.status) {
        case 0:
          return `待配送`;
          break;
        case 1:
          return `已完成`;
          break;
        case 2:
          return `配送中`;
          break;
        case 3:
          return `已取消`;
          break;
        default:
          break;
      }
    }
  },
  methods: {
    handleReload() {
      this.$emit('reload')
    }
  }
};
</script>

<style lang="less" scoped>
.wrap {
  width: 92vw;
  background: #fff;
  margin: 3vw auto;
  position: relative;
  .status {
    color: #ff3b30;
    font-size: 3.5vw;
    position: absolute;
    right: 5vw;
    top: 4.5vw;
  }
}
</style>